<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php echo $this->title;?></title>
<link rel="stylesheet" href="<?php echo $this->baseUrl;?>/files/admin/css/main.css" />
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/jquery.js"></script>
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/load.js"></script><!--bi-->
<link rel="stylesheet" href="<?php echo $this->baseUrl;?>/files/admin/css/bi.css" />
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/bi.js"></script>

<style>
.bi-body .bi-search-3{ height:70px;}
.bi-body .bi-search-3 .bi-s-center{height:48px;}
.bi-body .bi-search-3 .bi-s-center .bi-s-c-con{ height:26px;}
.bi-body .bi-search-3 .bi-s-center .bi-s-c-con .bi-s-c-sel td{ height:30px;}
</style>
<script language="javascript">
	function selCode(nu,pa){
		for(var i=1;i<=nu;i++){
			$("div#container"+i).hide();
			$("td#td"+i).removeClass("no_bottom_boder");
			$("td#td"+i).addClass("yes_boder");
		}
		$("div#container"+pa).show();
		$("td#td"+pa).removeClass();
		$("td#td"+pa).addClass("no_bottom_boder");
	}
</script>
</head>
<body style="overflow:auto;">
<div id="main" style="clear:both;">
		<div class="bi-body">
			<div class="clear" style="height:20px;"></div>
			<div class="bi-data">
				<div class="bi-d-top">
					<div class="d-t-left"></div>
					<div class="d-t-right"><span <?php if(count($this->rows)>0){?>class="show"<?php } else {?>class="hide"<?php }?> id="data_01" onclick="showData('01')" style="cursor:pointer;"></span></div>
				</div>
				<div class="bi-d-center  clear" id="data01">
					<div class="bi-d-center-bg">
					<!--content start-->


					<span class="d-line"></span>
					<div id="content" >
						<table width="710px" border="0" cellspacing="0" cellpadding="0" style="margin-bottom:20px">
						  <tr>
						    <td height="25" colspan="9">&nbsp;</td>
					      </tr>
						  <tr>
							<td width="190" height="23" class="bottom_boder_one">&nbsp;</td>
							<td onclick="selCode(4,1)" id="td1" width="80" align="center" class="no_bottom_boder" style="cursor:pointer">激活量</td>
							<td width="5" align="center" class="bottom_boder_one">&nbsp;</td>
							<td onclick="selCode(4,2)" id="td2" width="80" align="center" class="yes_boder" style="cursor:pointer">订单销售额</td>
							<td  align="center" class="bottom_boder_one">&nbsp;</td>
							
						  </tr>
					  </table>


						

						<!-- 3. Add the container -->
                        <!-- 3. Add the container -->
                        <script type="text/javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/highcharts/js/highcharts.js"></script>
						<script type="text/javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/highcharts/js/modules/exporting.js"></script>
                        
                        
						
        <script type="text/javascript">
		
			var chart;
			$(document).ready(function() {
				chart = new Highcharts.Chart({
					chart: {
						renderTo: 'container',
						zoomType: 'xy'
					},
					title: {
						text: '月销售视图'
					},
					subtitle: {
						text: '<?php echo $this->productName;?>'
					},
					xAxis: [{
						categories: [<?php echo $this->categories;?>],
						type: 'date',
						size: 100,
						labels: {
                        rotation: -70,
                        align: 'right'
                        }
					}],
					yAxis: [{ // Primary yAxis
						labels: {
							formatter: function() {
								return this.value +' 元';
							},
							style: {
								color: '#89A54E'
							}
						},
						title: {
							text: '订单金额',
							style: {
								color: '#89A54E'
							}
						},
						min:0
					}, { // Secondary yAxis
						title: {
							text: '订单数',
							style: {
								color: '#4572A7'
							}
						},
						min: 0,
						labels: {
							formatter: function() {
								return this.value +' 单';
							},
							style: {
								color: '#4572A7'
							}
						},
						opposite: true
					}],
					tooltip: {
						formatter: function() {
							return this.y +
								(this.series.name == '订单金额' ? ' 元' : '单');
						}
					},
					

					series: [{
						name: '订单数量',
						color: '#4572A7',
						type: 'spline',
						yAxis: 1,
						data: [<?php echo $this->monthOrderNum;?>]		
					
					}, {
						name: '订单金额',
						color: '#89A54E',
						type: 'spline',
						data: [<?php echo $this->monthSales;?>]
					}]
				});
				
				
			});
				
		</script>
		

						<div id="container2" style="display:none">
							<div id="container" style="width: 710px; height:300px; position:relative;overflow:hidden;"></div>
						</div>
	<script>					
       var chart;
			$(document).ready(function() {
				chart = new Highcharts.Chart({
					chart: {
						renderTo: 'clientnum',
						defaultSeriesType: 'line'
					},
					title: {
						text: '激活量'
					},
					subtitle: {
						text: '<?php echo $this->productName;?>' 
					},
					xAxis: {
						categories: [<?php echo $this->categories;?>],
						labels: {
							formatter: function() {
								return this.value; // clean, unformatted number for year
							},
							 rotation: -70,
                             align: 'right'
						},
						type: 'date',
						size: 100
					},
					yAxis: [{ // Primary yAxis
						labels: {
							formatter: function() {
								return this.value +' 次';
							},
							style: {
								color: '#89A54E'
							}
						},
						title: {
							text: '免费渠道',
							style: {
								color: '#89A54E'
							}
						},
						min:0
					}, { // Secondary yAxis
						title: {
							text: '广告渠道',
							style: {
								color: '#4572A7'
							}
						},
						labels: {
							formatter: function() {
								return this.value +' 次';
							},
							style: {
								color: '#4572A7'
							}
						},
						opposite: true
					}],
					tooltip: {
						enabled: true,
						formatter: function() {
							return '<b>'+ this.series.name +'</b><br/>'+
								 this.y +'';
						}
					},
					
					series: [{
						name: '广告渠道',
						color: '#4572A7',
						data: <?php echo $this->adInstallNum;?>
					}, {
						name: '免费渠道',
						color: '#89A54E',
						data: <?php echo $this->freeInstallNum;?>
					}]
				});
				
				
			});
				</script>
						
                        <!-- 3. Add the container -->
						<div id="container1">
							<div id="clientnum" style="width: 710px; height:300px; position:relative;overflow:hidden;"></div>
						</div>
						
						
					</div>
					<span class="d-line"></span>
					
					<!--content end-->
					</div>
				</div>
				<div class="bi-d-bottom"></div>
			</div>
			
			
			
		</div>
	
</div>
                        
						
						

</body>
</html>